<template>
	<div class="mall_goods_detail_buy">
		<ul>
			<li class="mall_goods_detail_buy_tools">
				<a @click="imMsg($event)" class="im_msg"><i class="icon-uniE915"></i>店铺</a>
				<a @click="onlineServe($event)" class="online_serve"><i class="icon-uniE908"></i>客服</a>
				<a @click="addFav($event)" class="add_fav"><i class="icon-12"></i>收藏</a>
			</li>
			<li>
				<router-link :to="{name:'addCart', params:{cid:cid,id:id}}" class="add_cart">加入购物车</router-link>
			</li>
			<li>
				<a @click="buyGoods($event)" class="buy_goods">立即购买</a>
			</li>
		</ul>
	</div>
</template>
<script>
	export default{
		name: "MallGoodsDetailTools",
		props:["shopid", "id", "cid"],
		data: function(){
			return{

			}
		},
		methods: {
			buyGoods(e) {

			},
			imMsg(e) {

			},
			onlineServe(e) {

			},
			addFav(e) {

			}
		}
	}
</script>
<style lang="less">
	@base:23.44/1rem;
	.mall_goods_detail_buy{
		position: fixed;
		bottom:0;
		left:0;
		right:0;
		z-index:1000;
		ul{
			display:flex;
			li{
				width:33.3333%;
				background-color:#fff;
				a{
					display: block;
					padding:20/@base;
					text-align: center;
					&.add_cart{
						background-color: #ffa500;
						color:#fff;
						font-weight: 700;
					}
					&.buy_goods{
						background-color: #ff0000;
						color:#fff;
						font-weight: 700;
					}
				}
				&.mall_goods_detail_buy_tools{
					display: flex;
					a{
						border-top:1/@base solid #efefef;
						border-bottom:1/@base solid #efefef;
						display:block;
						width:33.3333%;
						padding:15/@base 5/@base 0 5/@base;
						font-size:18/@base;
						i{
							font-size:24/@base;
							display: block;
							margin-bottom:5/@base;
						}
					}
				}
			}
		}
	}
</style>